<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	
	<title>M2 THYP1213</title>
	
	<link rel="stylesheet" type="text/css" href="style.css" />

	<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
	<script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script>
	<script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script>
	<script type="text/javascript" src="js/coda-slider.1.1.1.pack.js"></script>
	
	<script type="text/javascript">
	
		var theInt = null;
		var $crosslink, $navthumb;
		var curclicked = 0;
		
		theInterval = function(cur){
			clearInterval(theInt);
			
			if( typeof cur != 'undefined' )
				curclicked = cur;
			
			$crosslink.removeClass("active-thumb");
			$navthumb.eq(curclicked).parent().addClass("active-thumb");
				$(".stripNav ul li a").eq(curclicked).trigger('click');
			
			theInt = setInterval(function(){
				$crosslink.removeClass("active-thumb");
				$navthumb.eq(curclicked).parent().addClass("active-thumb");
				$(".stripNav ul li a").eq(curclicked).trigger('click');
				curclicked++;
				if( 14 == curclicked )
					curclicked = 0;
				
			}, 3000);
		};
		
		$(function(){
			
			$("#main-photo-slider").codaSlider();
			
			$navthumb = $(".nav-thumb");
			$crosslink = $(".cross-link");
			
			$navthumb
			.click(function() {
				var $this = $(this);
				theInterval($this.parent().attr('href').slice(1) - 1);
				return false;
			});
			
			theInterval();
		});
	</script>
</head>

<body>
<div class="cadre1">

	<div id="page-wrap">
	<div class="promo"></div>										
	<div class="slider-wrap">
		<div id="main-photo-slider" class="csw">
			<div class="panelContainer">

				<div class="panel" title="Panel 1">
					<div class="wrapper">
						<img class="big_img" src="https://lh4.googleusercontent.com/-nvei2W_viI8/UJ5ciNMhXoI/AAAAAAAAAHU/p2ePlHaqUns/s512/image-CV.png" alt="temp" />
						<div class="photo-meta-data">
							Etudiant: <a href="#">Fechtali Mehdi</a><br />
							<span>fechtali.mehdi</span>
						</div>
					</div>
				</div>		
				<div class="panel" title="Panel 2">
					<div class="wrapper">						
						<img class="big_img" src="https://lh4.googleusercontent.com/-od-sMqgGrwA/UG1Tzligb8I/AAAAAAAAAEQ/_CDQYav0BIY/s576/CAM00084.jpg" alt="scotch egg" class="floatLeft"/>
						
						<div class="photo-meta-data">
							Etudiant: <a href="#">Rachid Trahim</a><br />
							<span>Contact: trahim.rachid@gmail.com</span>
						</div>>
					</div>
				</div>
				<div class="panel" title="Panel 3">
					<div class="wrapper">
						<img class="big_img" src="https://lh6.googleusercontent.com/-29GINqx630k/UG1T1Ccw15I/AAAAAAAAADQ/SZtkkX0P4jk/s912/CAM00086.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiante: <a href="#">Kaoutar Raiss</a><br />
							<span>Contact: raiss.kaoutar@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 4">
					<div class="wrapper">
						<img class="big_img" src="https://lh3.googleusercontent.com/-OSPqpgrow3s/UG1T4LgZNkI/AAAAAAAAAA4/U9HNIrSvrrU/s640/CAM00087.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiant: <a href="#">Asserrar Mehdi </a><br />
							<span>Contact: asserrar.mehdi@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 5">
					<div class="wrapper">
						<img class="big_img" src="https://lh6.googleusercontent.com/-rx_XWRPaGJ0/UG1T7nV-U4I/AAAAAAAAABA/pwjpp2uk78g/s576/CAM00088.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiant: <a href="#">Nadir Gharzal </a><br />
							<span>Contact: nadir.gharzal@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 6">
					<div class="wrapper">
						<img class="big_img" src="https://lh4.googleusercontent.com/-06FdUPCRonk/UI5N1Cj5JZI/AAAAAAAAAGg/_vLOK-fQQMo/s512/IRNATENE_Fahem.JPG" alt="temp" />
						<div class="photo-meta-data">
							Etudiant: <a href="#">Fahem Irnatene </a><br />
							<span>Contact: f.irnatene@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 7">
					<div class="wrapper">
						<img class="big_img" src="https://lh6.googleusercontent.com/-lF9q2w3pPwc/UG1UCtyGSAI/AAAAAAAAABQ/N2gibSh1ymc/s576/CAM00090.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiante: <a href="#">Hajar Morchid </a><br />
							<span>Contact: hajar.morchid@gmail.com</span>		
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 8">
					<div class="wrapper">
						<img class="big_img" src="https://lh6.googleusercontent.com/-oZiTzvQ04NE/UG1UF7TlecI/AAAAAAAAADQ/Jydre5RmbQM/s576/CAM00092.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiante: <a href="#">Houda Ganouch </a><br />
							<span>Contact: houda.ganouch@gmail.com</span>					 
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 9">
					<div class="wrapper">
						<img class="big_img" src="https://lh3.googleusercontent.com/-2bVU70ZTKek/UG1UJDNRCOI/AAAAAAAAADQ/bVgJKEtvP2M/s576/CAM00094.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiante: <a href="#">Amirat Ouerdia</a><br />
							<span>Contact: amirat.ouerdia@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 10">
					<div class="wrapper">
						<img class="big_img" src="https://lh4.googleusercontent.com/-jBZxeyFJ4V8/UJzMNGfj3qI/AAAAAAAAAGw/H_Hb2iA1IkU/s512/184333_173337939379475_5083613_n.jpg"alt="temp" />
						<div class="photo-meta-data">
							Etudiant: <a href="#">Amin Benhsin</a><br />
							<span>Contact: amin.benhsin@gmail.com </span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 11">
					<div class="wrapper">
						<img class="big_img" src="https://lh5.googleusercontent.com/-Se0lixrnlSk/UG1UPK9vw6I/AAAAAAAAADQ/eWOHNQo6Di4/s576/CAM00096.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiante: <a href="#">Amel Mecheddal</a><br />
							<span>Contact: Amel.mecheddal@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 12">
					<div class="wrapper">					
						<img class="big_img" src="https://lh6.googleusercontent.com/-QrdQ6picqR0/UG1USpmmyzI/AAAAAAAAAB4/cs0KvzwBWPU/s576/CAM00097.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiant: <a href="#">Yu XinXin</a><br />
							<span>Contact: yuxxlive@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 13">
					<div class="wrapper">
						<img class="big_img" src="https://lh4.googleusercontent.com/-2Ned2HNYQqc/UG1UVUHBSNI/AAAAAAAAACA/ofqGnJal8wc/s576/CAM00098.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiant: <a href="#">Zakaria Amzil</a><br />
							<span>Contact: zakaria.amzil9@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 14">
					<div class="wrapper">
						<img class="big_img" src="https://lh6.googleusercontent.com/-nX9LtFOZB2g/UG1UYh1qqMI/AAAAAAAAAD4/8-QXOxZ-3bM/s576/CAM00099.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiante: <a href="#">Halima Kenouche</a><br />
							<span>Contact: halima.kennouche@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 15">
					<div class="wrapper">
						<img class="big_img" src="https://lh3.googleusercontent.com/-m7KS57jQu5E/UG1UcOZdkzI/AAAAAAAAADQ/DgbrAotYsug/s576/CAM00101.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiante: <a href="#">Kahina Meftahi</a><br />
							<span>Contact: kahina.meftahi@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 16">
					<div class="wrapper">
						<img class="big_img" src="https://lh3.googleusercontent.com/-3xOoosecBgY/UG1Ufe8kIcI/AAAAAAAAADQ/6fZld0grwOo/s576/CAM00102.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiante: <a href="#">Hammouda Halima</a><br />
							<span>Contact: hammouda.halima@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 17">
					<div class="wrapper">
						<img class="big_img" src="https://lh4.googleusercontent.com/-oIHdXzYB6Ac/UJosAJQVxpI/AAAAAAAAAF0/b2OzGSJOSoI/s640/CAM00104%255B1%255D.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiante: <a href="#">Houda Msakem</a><br />
							<span>Contact: houdamsakem@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 18">
					<div class="wrapper">
						<img class="big_img" src="https://lh4.googleusercontent.com/-Nf6ptsA5I-U/UJosQFzdHKI/AAAAAAAAAF8/sK-C7CO82PY/s640/CAM00105%255B1%255D.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiant: <a href="#">Diaa Bouabdallah</a><br />
							<span>Contact: dbouabdallah@gmail.com</span>
						</div>
					</div>
				</div>
				<div class="panel" title="Panel 19">
					<div class="wrapper">
						<img class="big_img" src="https://lh6.googleusercontent.com/-GcsbOVUr8To/UJosaY8CRKI/AAAAAAAAAGQ/7DiSV1npPw8/s640/CAM00106%255B1%255D.jpg" alt="temp" />
						<div class="photo-meta-data">
							Etudiant: <a href="#">Rachid Naitmammar</a><br />
							<span>Contact: rachid.naitmammar@gmail.com</span>
						</div>
					</div>
				</div>
				
			</div>
		</div>
	</div>
</div>
</div>
</body>
</html>